<!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Metorik - Responsive Bootstrap 4 Admin Dashboard Template</title>
    <!-- Favicon -->
    <link rel="shortcut icon" href="../src/images/favicon.ico"/>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="../src/css/bootstrap.min.css">
    <!-- Typography CSS -->
    <link rel="stylesheet" href="../src/css/typography.css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="../src/css/style.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="../src/css/responsive.css">
</head>
<body>
<!-- loader Start -->
<div id="loading">

</div>
<!-- loader END -->
<!-- Wrapper Start -->
<div class="wrapper">
    <!-- Sidebar  -->
    <div class="iq-sidebar">
        <div class="iq-sidebar-logo d-flex justify-content-between">
            <a href="index.html">
                <img src="../src/images/logo.gif" class="img-fluid" alt="">
                <span>DaLao</span>
            </a>
            <div class="iq-menu-bt align-self-center">
                <div class="wrapper-menu">
                    <div class="line-menu half start"></div>
                    <div class="line-menu"></div>
                    <div class="line-menu half end"></div>
                </div>
            </div>
        </div>
        <div id="sidebar-scrollbar">
            <div id="menu"></div>
            <div class="p-3"></div>
        </div>
    </div>
    <!-- TOP Nav Bar -->
    <div class="iq-top-navbar">
        <div class="iq-navbar-custom">
            <div class="iq-sidebar-logo">
                <div class="top-logo">
                    <a href="index.html" class="logo">
                        <img src="../src/images/logo.gif" class="img-fluid" alt="">
                        <span>DaLao</span>
                    </a>
                </div>
            </div>
            <div class="navbar-breadcrumb">
                <h5 class="mb-0">用户编辑</h5>
                <nav aria-label="breadcrumb">
                    <ul class="breadcrumb">
                        <li class="breadcrumb-item"><a href="index.html">主页</a></li>
                        <li class="breadcrumb-item active" aria-current="page">用户编辑</li>
                    </ul>
                </nav>
            </div>
            <div id="navigation"></div>
        </div>
    </div>
    <!-- TOP Nav Bar END -->
    <!-- Page Content  -->
    <div id="content-page" class="content-page">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="iq-card">
                        <div class="iq-card-body p-0">
                            <div class="iq-edit-list">
                                <ul class="iq-edit-profile d-flex nav nav-pills">
                                    <li class="col-md-3 p-0">
                                        <a class="nav-link active" data-toggle="pill" href="#personal-information">
                                            个人信息
                                        </a>
                                    </li>
                                    <li class="col-md-3 p-0">
                                        <a class="nav-link" data-toggle="pill" href="#chang-pwd">
                                            修改密码
                                        </a>
                                    </li>
                                    <li class="col-md-3 p-0">
                                        <a class="nav-link" data-toggle="pill" href="#emailandsms">
                                            电子邮件和短信
                                        </a>
                                    </li>
                                    <li class="col-md-3 p-0">
                                        <a class="nav-link" data-toggle="pill" href="#manage-contact">
                                            管理联系人
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <div class="iq-edit-list-data">
                        <div class="tab-content">
                            <div class="tab-pane fade active show" id="personal-information" role="tabpanel">
                                <div class="iq-card">
                                    <div class="iq-card-header d-flex justify-content-between">
                                        <div class="iq-header-title">
                                            <h4 class="card-title">个人信息</h4>
                                        </div>
                                    </div>
                                    <div class="iq-card-body">
                                        <form>
                                            <div class="form-group row align-items-center">
                                                <div class="col-md-12">
                                                    <div class="profile-img-edit">
                                                        <img class="profile-pic" src="../src/images/user/11.png"
                                                             alt="profile-pic">
                                                        <div class="p-image">
                                                            <i class="ri-pencil-line upload-button"></i>
                                                            <input class="file-upload" type="file" accept="image/*"/>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class=" row align-items-center">
                                                <div class="form-group col-sm-6">
                                                    <label for="fname">姓名:</label>
                                                    <input type="text" class="form-control" id="fname" value="大佬">
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label for="uname">用户名:</label>
                                                    <input type="text" class="form-control" id="uname" value="dalao">
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label for="cname">城市:</label>
                                                    <input type="text" class="form-control" id="cname" value="北京">
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label class="d-block">性别:</label>
                                                    <div class="custom-control custom-radio custom-control-inline">
                                                        <input type="radio" id="customRadio6" name="customRadio1"
                                                               class="custom-control-input" checked="">
                                                        <label class="custom-control-label" for="customRadio6">
                                                            男 </label>
                                                    </div>
                                                    <div class="custom-control custom-radio custom-control-inline">
                                                        <input type="radio" id="customRadio7" name="customRadio1"
                                                               class="custom-control-input">
                                                        <label class="custom-control-label" for="customRadio7">
                                                            女 </label>
                                                    </div>
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label for="dob">出生日期:</label>
                                                    <input type="date" class="form-control" id="dob" value="1999-09-03">
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label>婚姻状态:</label>
                                                    <select class="form-control" id="mrgstatus">
                                                        <option selected="">单身</option>
                                                        <option>已婚</option>
                                                        <option>丧偶</option>
                                                        <option>离婚</option>
                                                        <option>分开</option>
                                                    </select>
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label>年龄:</label>
                                                    <select class="form-control" id="age">
                                                        <option>12-18</option>
                                                        <option>19-32</option>
                                                        <option selected="">33-45</option>
                                                        <option>46-62</option>
                                                        <option>63 ></option>
                                                    </select>
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label>国家:</label>
                                                    <select class="form-control" id="country">
                                                        <option selected="">中国</option>
                                                        <option>美国</option>
                                                        <option>印度</option>
                                                        <option>非洲</option>
                                                    </select>
                                                </div>
                                                <div class="form-group col-sm-6">
                                                    <label>城市:</label>
                                                    <select class="form-control" id="state">
                                                        <option>北京</option>
                                                        <option>沈阳</option>
                                                        <option selected="">云南</option>
                                                        <option>新疆</option>
                                                        <option>大连</option>
                                                    </select>
                                                </div>
                                                <div class="form-group col-sm-12">
                                                    <label>地址:</label>
                                                    <textarea class="form-control" name="address" rows="5"
                                                              style="line-height: 22px;">北京市怀柔区尚坤学院
                                             </textarea>
                                                </div>
                                            </div>
                                            <button type="submit" class="btn btn-primary mr-2">提交</button>
                                            <button type="reset" class="btn iq-bg-danger">取消</button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="chang-pwd" role="tabpanel">
                                <div class="iq-card">
                                    <div class="iq-card-header d-flex justify-content-between">
                                        <div class="iq-header-title">
                                            <h4 class="card-title">修改密码</h4>
                                        </div>
                                    </div>
                                    <div class="iq-card-body">
                                        <form>
                                            <div class="form-group">
                                                <label for="cpass">当前密码:</label>
                                                <a href="javascripe:void();" class="float-right">忘记密码</a>
                                                <input type="Password" class="form-control" id="cpass" value="">
                                            </div>
                                            <div class="form-group">
                                                <label for="npass">新密码:</label>
                                                <input type="Password" class="form-control" id="npass" value="">
                                            </div>
                                            <div class="form-group">
                                                <label for="vpass">验证密码:</label>
                                                <input type="Password" class="form-control" id="vpass" value="">
                                            </div>
                                            <button type="submit" class="btn btn-primary mr-2">提交</button>
                                            <button type="reset" class="btn iq-bg-danger">取消</button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="emailandsms" role="tabpanel">
                                <div class="iq-card">
                                    <div class="iq-card-header d-flex justify-content-between">
                                        <div class="iq-header-title">
                                            <h4 class="card-title">电子邮件和短信</h4>
                                        </div>
                                    </div>
                                    <div class="iq-card-body">
                                        <form>
                                            <div class="form-group row align-items-center">
                                                <label class="col-md-3" for="emailnotification">电子邮件
                                                   通知:</label>
                                                <div class="col-md-9 custom-control custom-switch">
                                                    <input type="checkbox" class="custom-control-input"
                                                           id="emailnotification" checked="">
                                                    <label class="custom-control-label" for="emailnotification"></label>
                                                </div>
                                            </div>
                                            <div class="form-group row align-items-center">
                                                <label class="col-md-3" for="smsnotification">短信通知:</label>
                                                <div class="col-md-9 custom-control custom-switch">
                                                    <input type="checkbox" class="custom-control-input"
                                                           id="smsnotification" checked="">
                                                    <label class="custom-control-label" for="smsnotification"></label>
                                                </div>
                                            </div>
                                            <div class="form-group row align-items-center">
                                                <label class="col-md-3" for="npass">何时发送电子邮件</label>
                                                <div class="col-md-9">
                                                    <div class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input"
                                                               id="email01">
                                                        <label class="custom-control-label" for="email01">新的通知</label>
                                                    </div>
                                                    <div class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input"
                                                               id="email02">
                                                        <label class="custom-control-label" for="email02">自动回复</label>
                                                    </div>
                                                    <div class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input" id="email03"
                                                               checked="">
                                                        <label class="custom-control-label" for="email03">有人回复</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="form-group row align-items-center">
                                                <label class="col-md-3" for="npass">何时上报电子邮件</label>
                                                <div class="col-md-9">
                                                    <div class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input"
                                                               id="email04">
                                                        <label class="custom-control-label" for="email04">新的命令</label>
                                                    </div>
                                                    <div class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input"
                                                               id="email05">
                                                        <label class="custom-control-label" for="email05">新的会员资格批准</label>
                                                    </div>
                                                    <div class="custom-control custom-checkbox">
                                                        <input type="checkbox" class="custom-control-input" id="email06"
                                                               checked="">
                                                        <label class="custom-control-label" for="email06">会员登记</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <button type="submit" class="btn btn-primary mr-2">提交</button>
                                            <button type="reset" class="btn iq-bg-danger">取消</button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="manage-contact" role="tabpanel">
                                <div class="iq-card">
                                    <div class="iq-card-header d-flex justify-content-between">
                                        <div class="iq-header-title">
                                            <h4 class="card-title">管理联系人</h4>
                                        </div>
                                    </div>
                                    <div class="iq-card-body">
                                        <form>
                                            <div class="form-group">
                                                <label for="cno">联系电话:</label>
                                                <input type="text" class="form-control" id="cno"
                                                       value="13126719772">
                                            </div>
                                            <div class="form-group">
                                                <label for="email">邮箱:</label>
                                                <input type="text" class="form-control" id="email"
                                                       value="2454148665@qq.com">
                                            </div>
                                            <div class="form-group">
                                                <label for="url">网址:</label>
                                                <input type="text" class="form-control" id="url"
                                                       value="https://www.baidu.com">
                                            </div>
                                            <button type="submit" class="btn btn-primary mr-2">提交</button>
                                            <button type="reset" class="btn iq-bg-danger">取消</button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Wrapper END -->
<!-- Footer -->
<div id="bottom"></div>
<!-- Footer END -->
</body>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="../src/js/jquery.min.js"></script>
<script src="../src/js/popper.min.js"></script>
<script src="../src/js/bootstrap.min.js"></script>
<!-- Appear JavaScript -->
<script src="../src/js/jquery.appear.js"></script>
<!-- Countdown JavaScript -->
<script src="../src/js/countdown.min.js"></script>
<!-- Counterup JavaScript -->
<script src="../src/js/waypoints.min.js"></script>
<script src="../src/js/jquery.counterup.min.js"></script>
<!-- Wow JavaScript -->
<script src="../src/js/wow.min.js"></script>
<!-- Apexcharts JavaScript -->
<script src="../src/js/apexcharts.js"></script>
<!-- Select2 JavaScript -->
<script src="../src/js/select2.min.js"></script>
<!-- Owl Carousel JavaScript -->
<script src="../src/js/owl.carousel.min.js"></script>
<!-- Magnific Popup JavaScript -->
<script src="../src/js/jquery.magnific-popup.min.js"></script>
<!-- Smooth Scrollbar JavaScript -->
<script src="../src/js/smooth-scrollbar.js"></script>
<!-- lottie JavaScript -->
<script src="../src/js/lottie.js"></script>
<!-- Chart Custom JavaScript -->
<script src="../src/js/chart-custom.js"></script>
<!-- Custom JavaScript -->
<script src="../src/js/custom.js"></script>
<script>
    $(function () {
        $("#menu").load("menus.html");
        $("#navigation").load("navigation-bar.html");
        $("#bottom").load("bottom-bar.html");
    });
</script>
</html>